<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" href="/css/font.css">
		<link rel="stylesheet" href="/css/xadmin.css">
		<script type="text/javascript" src="/js/jquery.min.js"></script>
        <script type="text/javascript" src="/js/xadmin.js"></script>
        <script type="text/javascript" src="/lib/layui/layui.js" charset="utf-8"></script>
		<style>
			form {
				margin-top: 10px;
			}
			
		</style>
	</head>
	<body>
		<form class="layui-form" id="editStudentForm">
			<div class="layui-form-item">
				<label class="layui-form-label"><font color="red" size="3">*</font>学号</label>
				<div class="layui-input-block">
					<input type="number" name="stuNo" required lay-verify="required|stuNo" disabled th:attr="value=${student.stuNo}" placeholder="10位数字，且不能出现空格" autocomplete="off" class="layui-input">
					<input type="hidden" name="stuNo" th:attr="value=${student.stuNo}">
					<input type="hidden" name="stuId" th:attr="value=${student.stuId}">
					<input type="hidden" name="majorNo" th:attr="value=${student.majorNo}">
					<input type="hidden" name="schoolDep" th:attr="value=${student.schoolDep}">
				</div>
			</div>
			<div class="layui-form-item">
                <label class="layui-form-label"><font color="red" size="3">*</font>姓名</label>
                <div class="layui-input-block">
                    <input type="text" name="stuName" th:attr="value=${student.stuName}" required lay-verify="required|stuName" placeholder="2-15个字符，且不能出现空格" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><font color="red" size="3">*</font>身份证号</label>
                <div class="layui-input-block">
                    <input type="text" name="idNumber" th:attr="value=${student.idNumber}" required lay-verify="required|idNumber" placeholder="请输入正确的身份证号" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
			    <label class="layui-form-label"><font color="red" size="3">*</font>性别</label>
			    <div class="layui-input-block">
				  <input type="radio" name="stuSex" value="2" title="男" th:if="${student.stuSex == 2}" checked>
				  <input type="radio" name="stuSex" value="2" title="男" th:if="${student.stuSex != 2}">
				  <input type="radio" name="stuSex" value="1" title="女" th:if="${student.stuSex == 1}" checked>
				  <input type="radio" name="stuSex" value="1" title="女" th:if="${student.stuSex != 1}">
				</div>
			  </div>
	        <div class="layui-form-item">
               <label class="layui-form-label"><font color="red" size="3">*</font>出生日期</label>
               <div class="layui-input-block">
                   <input type="text" name="stuBirth" required th:attr="value=${student.stuBirth}" lay-verify="required" id="stuBirth" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
               </div>
            </div>
			<div class="layui-form-item">
			   <label class="layui-form-label"><font color="red" size="3">*</font>政治面貌</label>
			   <div class="layui-input-block">
			       <select name="politics" lay-verify="required">
					<option value=""></option>
					<option value="中共党员" th:if="${student.politics == '中共党员'}" selected>中共党员</option>
					<option value="中共党员" th:if="${student.politics != '中共党员'}">中共党员</option>
					<option value="共青团员" th:if="${student.politics == '共青团员'}" selected>共青团员</option>
					<option value="共青团员" th:if="${student.politics != '共青团员'}">共青团员</option>
					<option value="群众" th:if="${student.politics == '群众'}" selected>群众</option>
					<option value="群众" th:if="${student.politics != '群众'}">群众</option>
				  </select>
			   </div>
			</div>
			<div class="layui-form-item">
			   <label class="layui-form-label"><font color="red" size="3">*</font>民族</label>
			   <div class="layui-input-block">
			       <input type="text" name="nation" required th:attr="value=${student.nation}" lay-verify="required|nation" placeholder="1-5个字符，且不能出现空格" autocomplete="off" class="layui-input">
			   </div>
			</div>
			<div class="layui-form-item">
			   <label class="layui-form-label"><font color="red" size="3">*</font>籍贯</label>
			   <div class="layui-input-block">
			       <input type="text" name="homeplace" required th:attr="value=${student.homeplace}" lay-verify="required|homeplace" placeholder="1-10个字符，且不能出现空格" autocomplete="off" class="layui-input">
			   </div>
			</div>
			<div class="layui-form-item">
			   <label class="layui-form-label">毕业学校</label>
			   <div class="layui-input-block">
			       <input type="text" name="graduateSchool" required th:attr="value=${student.graduateSchool}" lay-verify="graduateSchool" placeholder="1-15个字符，且不能出现空格" autocomplete="off" class="layui-input">
			   </div>
			</div>
			<div class="layui-form-item">
			   <label class="layui-form-label"><font color="red" size="3">*</font>入学日期</label>
			   <div class="layui-input-block">
			       <input type="text" name="startTime" required th:attr="value=${student.startTime}" lay-verify="required" id="startTime" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
			   </div>
			</div>
			<div class="layui-form-item" id="app">
               <label class="layui-form-label"><font color="red" size="3">*</font>学制</label>
               <input type="hidden" th:attr="value=${student.gradeLength}" id="gradeLength"/>
               <div class="layui-input-block">
                   <select name="gradeLength" lay-verify="required">
                        <option value=""></option>
                        <option value="2" v-if="gradeLength == 2" selected>二年</option>
                        <option value="2" v-else>二年</option>
                        <option value="3" v-if="gradeLength == 3" selected>三年</option>
                        <option value="3" v-else>三年</option>
                        <option value="4" v-if="gradeLength == 4" selected>四年</option>
                        <option value="4" v-else>二年</option>
                   </select>
               </div>
            </div>
			<div class="layui-form-item">
			   <label class="layui-form-label">通讯地址</label>
			   <div class="layui-input-block">
			       <input type="text" name="address" required th:attr="value=${student.address}" lay-verify="address" placeholder="1-20个字符，且不能出现空格" autocomplete="off" class="layui-input">
			   </div>
			</div>
			<div class="layui-form-item">
			   <label class="layui-form-label">手机号码</label>
			   <div class="layui-input-block">
			       <input type="text" name="number" required th:attr="value=${student.number}" lay-verify="number" placeholder="1-50个字符，且不能出现空格" autocomplete="off" class="layui-input">
			   </div>
			</div>
			<div class="layui-form-item">
			   <label class="layui-form-label">寝室地址</label>
			   <div class="layui-input-block">
			       <input type="text" name="bedroomId" required th:attr="value=${student.bedroomId}" lay-verify="bedroomId" placeholder="1-10个字符，且不能出现空格" autocomplete="off" class="layui-input">
			   </div>
			</div>
			<div class="layui-form-item">
			   <label class="layui-form-label">备注</label>
			   <div class="layui-input-block">
			       <textarea name="remark1" placeholder="1-50个字符" th:text="${student.remark1}" class="layui-textarea"></textarea>
			   </div>
			</div>
			<div class="layui-form-item">
				<div class="layui-input-block">
					<button class="layui-btn" lay-submit lay-filter="formDemo" type="button">立即提交</button>
				</div>
			</div>
		</form>
		
        <script type="text/javascript" src="/js/vue.min.js"></script>
        <script type="text/javascript" src="/js/jquery.form.js"></script>
		<script>
		    $(function() {
		    	// 日期格式转换
		    	var stuBirth = $("input[name='stuBirth']").val();
		    	stuBirth = new Date(stuBirth);
		    	var year = stuBirth.getFullYear();
		        var month = stuBirth.getMonth()+1;
		        month = month < 10 ? '0'+month : month;
		        var date = stuBirth.getDate();
		        date = date < 10 ? '0'+date : date;
		        $("input[name='stuBirth']").attr("value",[year,month,date].join('-'));
		        
		        var startTime = $("input[name='startTime']").val();
		        startTime = new Date(stuBirth);
                var year = startTime.getFullYear();
                var month = startTime.getMonth()+1;
                month = month < 10 ? '0'+month : month;
                var date = startTime.getDate();
                date = date < 10 ? '0'+date : date;
                $("input[name='startTime']").attr("value",[year,month,date].join('-'));
		        
		    })
		
		    var vm = new Vue({
                el : '#app',
                data : {
                	// 学制
                    gradeLength : "",
                },
                created : function() {
                    this.setGradeLength();
                },
                methods : {
                	setGradeLength : function() {
                		this.gradeLength = $("#gradeLength").val();
                    }
                }
            });
		    
			layui.use(['form', 'layedit', 'laydate'], function(){
				var form = layui.form
				,layer = layui.layer
				var laydate = layui.laydate;
				laydate.render({
					elem: '#stuBirth' //指定元素
			    });
				laydate.render({
					elem: '#startTime', //指定元素
				});
				var reg_graduateSchool = /^[\S]{1,15}$/;
				var reg_address = /^[\S]{1,20}$/;
				var reg_number = /^[\S]{1,50}$/;
				var reg_bedroomId = /^[\S]{1,10}$/;
				var reg_remark1 = /^[\S]{1,50}$/;
				form.verify({
					// 学号
					stuNo: [/^[\S]{10}$/,'10位数字，且不能出现空格'],
					// 姓名
					stuName: [/^[\S]{2,15}$/,'2-15个字符，且不能出现空格'],
					// 身份证号
					idNumber: [/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,'请输入正确的身份证号'],
					// 民族
					nation : [/^[\S]{1,10}$/,'1-5个字符，且不能出现空格'],
					// 籍贯
					homeplace : [/^[\S]{1,10}$/,'1-10个字符，且不能出现空格'],
					// 毕业学校
					graduateSchool: function(value) {
						if(value.length > 0 && !reg_graduateSchool.test(value)) {
							return "1-15个字符，且不能出现空格";
						}
					},
					// 通讯地址
					address: function(value) {
						if(value.length > 0 && !reg_number.test(value)) {
							return "1-20个字符，且不能出现空格";
						}
					},
					// 手机号码
					number: function(value) {
						if(value.length > 0 && !reg_address.test(value)) {
							return "1-50个字符，且不能出现空格";
						}
					},
					// 寝室地址
					bedroomId: function(value) {
						if(value.length > 0 && !reg_bedroomId.test(value)) {
							return "1-10个字符，且不能出现空格";
						}
					},
					// 备注
					remark1: function(value) {
						if(value.length > 0 && !reg_remark1.test(value)) {
							return "1-50个字符";
						}
					},
				});
			
				//监听提交
				form.on('submit(formDemo)', function(data){
					$.ajax({
                        url : "/sys/student/info/editStudent",
                        type : "post",
                        data : $("#editStudentForm").serializeArray(),
                        success : function(result) {
                            if (result.state) {
                                layer.msg('修改成功！', {icon: 1,time: 1000}, function(){
                                    // 1.先得到当前iframe层的索引
                                    var index = parent.layer.getFrameIndex(window.name); 
                                    // 2.再执行关闭 
                                    parent.layer.close(index); 
                                    // 调用父页面的方法
                                    window.parent.updateEditData();
                                });
                            } else {
                                layer.msg(""+result.msg, {icon: 5});
                            }
                        }
                    });
				});
			});
		</script>
	</body>
</html>
